ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳಿಗಾಗಿ ಮಾಡ್ಯೂಲ್ ಫೆಡರೇಶನ್‌ನ ಆಳವಾದ ಅಧ್ಯಯನ. ರನ್‌ಟೈಮ್‌ನಲ್ಲಿ ಕೋಡ್ ಮತ್ತು ಡಿಪೆಂಡೆನ್ಸಿಗಳನ್ನು ಹಂಚಿಕೊಳ್ಳುವುದು, ಬಂಡಲ್ ಗಾತ್ರವನ್ನು ಕಡಿಮೆ ಮಾಡುವುದು ಮತ್ತು ಸ್ವತಂತ್ರ ನಿಯೋಜನೆಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸುವುದು ಹೇಗೆ ಎಂದು ತಿಳಿಯಿರಿ.
ಮಾಡ್ಯೂಲ್ ಫೆಡರೇಶನ್: ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳಲ್ಲಿ ರನ್‌ಟೈಮ್ ಮಾಡ್ಯೂಲ್ ಹಂಚಿಕೆಗಾಗಿ ನಿರ್ಣಾಯಕ ಮಾರ್ಗದರ್ಶಿ
ವೆಬ್ ಡೆವಲಪ್‌ಮೆಂಟ್‌ನ ನಿರಂತರವಾಗಿ ಬದಲಾಗುತ್ತಿರುವ ಜಗತ್ತಿನಲ್ಲಿ, ನಾವು ಗಮನಾರ್ಹ ವಾಸ್ತುಶಿಲ್ಪದ ಬದಲಾವಣೆಯನ್ನು ನೋಡಿದ್ದೇವೆ. ನಾವು ಸ್ಕೇಲೆಬಿಲಿಟಿ ಮತ್ತು ತಂಡದ ಸ್ವಾಯತ್ತತೆಯನ್ನು ಹುಡುಕುತ್ತಾ, ಮೊನೊಲಿಥಿಕ್ ಆರ್ಕಿಟೆಕ್ಚರ್‌ಗಳಿಂದ ಬ್ಯಾಕೆಂಡ್ ಮೈಕ್ರೋಸರ್ವಿಸಸ್‌ಗಳತ್ತ ಪ್ರಯಾಣ ಬೆಳೆಸಿದೆವು. ಈಗ, ಅದೇ ಕ್ರಾಂತಿಯು ಫ್ರಂಟ್‌ಎಂಡ್ ಅನ್ನು ಪರಿವರ್ತಿಸುತ್ತಿದೆ. ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳ ಯುಗ ಬಂದಿದೆ, ಮತ್ತು ಅದರ ಹೃದಯಭಾಗದಲ್ಲಿ ಒಂದು ಶಕ್ತಿಯುತ ತಂತ್ರಜ್ಞಾನವಿದೆ, ಅದು ಎಲ್ಲವನ್ನೂ ಕಾರ್ಯಸಾಧ್ಯವಾಗಿಸುತ್ತದೆ: ಮಾಡ್ಯೂಲ್ ಫೆಡರೇಶನ್.
ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳ ಮೂಲಭೂತ ಸವಾಲು ಹೇಳಲು ಸರಳವಾಗಿದ್ದರೂ, ಪರಿಹರಿಸಲು ಕಷ್ಟಕರವಾಗಿತ್ತು: ನಿಧಾನವಾದ, ದೊಡ್ಡದಾದ ಮತ್ತು ನಿರ್ವಹಿಸಲಾಗದ ಗೊಂದಲವನ್ನು ಸೃಷ್ಟಿಸದೆ, ಅನೇಕ, ಸ್ವತಂತ್ರವಾಗಿ ನಿಯೋಜಿಸಲಾದ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಿಂದ ಒಂದೇ, ಸುಸಂಬದ್ಧ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ಹೇಗೆ ನಿರ್ಮಿಸುವುದು? ಕಾಂಪೊನೆಂಟ್ ಲೈಬ್ರರಿಗಳು ಅಥವಾ ರಿಯಾಕ್ಟ್‌ನಂತಹ ಫ್ರೇಮ್‌ವರ್ಕ್‌ಗಳಂತಹ ಸಾಮಾನ್ಯ ಕೋಡ್ ಅನ್ನು ಆವೃತ್ತಿಯ ಸಮಸ್ಯೆಗಳನ್ನು ಸೃಷ್ಟಿಸದೆ ಅಥವಾ ಸಂಯೋಜಿತ ಬಿಡುಗಡೆಗಳನ್ನು ಒತ್ತಾಯಿಸದೆ ನಾವು ಹೇಗೆ ಹಂಚಿಕೊಳ್ಳುವುದು?
ಮಾಡ್ಯೂಲ್ ಫೆಡರೇಶನ್ ಈ ಸಮಸ್ಯೆಯನ್ನು ಸೊಗಸಾಗಿ ಪರಿಹರಿಸುತ್ತದೆ. ವೆಬ್‌ಪ್ಯಾಕ್ 5 ರಲ್ಲಿ ಪರಿಚಯಿಸಲಾದ ಇದು ಕೇವಲ ಮತ್ತೊಂದು ಫೀಚರ್ ಅಲ್ಲ; ಇದು ನಾವು ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ನಿರ್ಮಿಸುವ ಮತ್ತು ನಿಯೋಜಿಸುವ ಬಗ್ಗೆ ಯೋಚಿಸುವ ರೀತಿಯಲ್ಲಿ ಒಂದು ಮಾದರಿ ಬದಲಾವಣೆಯಾಗಿದೆ. ಈ ಸಮಗ್ರ ಮಾರ್ಗದರ್ಶಿಯು ಮಾಡ್ಯೂಲ್ ಫೆಡರೇಶನ್‌ನ ಏನು, ಏಕೆ ಮತ್ತು ಹೇಗೆ ಎಂಬುದನ್ನು ಅನ್ವೇಷಿಸುತ್ತದೆ, ಅದರ ಅತ್ಯಂತ ಪರಿವರ್ತಕ ಸಾಮರ್ಥ್ಯವಾದ: ರನ್‌ಟೈಮ್ ಮಾಡ್ಯೂಲ್ ಹಂಚಿಕೆಯ ಮೇಲೆ ಕೇಂದ್ರೀಕರಿಸುತ್ತದೆ.
ತ್ವರಿತ ಪುನರಾವಲೋಕನ: ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳು ಎಂದರೇನು?
ಮಾಡ್ಯೂಲ್ ಫೆಡರೇಶನ್‌ನ ಯಂತ್ರಶಾಸ್ತ್ರವನ್ನು ಪರಿಶೀಲಿಸುವ ಮೊದಲು, ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳು ಎಂದರೆ ಏನು ಎಂಬುದರ ಕುರಿತು ಸ್ಪಷ್ಟಪಡಿಸೋಣ. ಒಂದು ದೊಡ್ಡ ಇ-ಕಾಮರ್ಸ್ ವೆಬ್‌ಸೈಟ್ ಅನ್ನು ಕಲ್ಪಿಸಿಕೊಳ್ಳಿ. ಮೊನೊಲಿಥಿಕ್ ಜಗತ್ತಿನಲ್ಲಿ, ಸಂಪೂರ್ಣ ಫ್ರಂಟ್‌ಎಂಡ್—ಉತ್ಪನ್ನ ಹುಡುಕಾಟ, ಉತ್ಪನ್ನ ವಿವರಗಳು, ಶಾಪಿಂಗ್ ಕಾರ್ಟ್, ಮತ್ತು ಚೆಕ್‌ಔಟ್—ಒಂದೇ, ದೊಡ್ಡ ಅಪ್ಲಿಕೇಶನ್ ಆಗಿದೆ. ಚೆಕ್‌ಔಟ್ ಬಟನ್‌ಗೆ ಒಂದು ಸಣ್ಣ ಬದಲಾವಣೆಯು ಸಂಪೂರ್ಣ ಅಪ್ಲಿಕೇಶನ್ ಅನ್ನು ಪರೀಕ್ಷಿಸಲು ಮತ್ತು ಮರು-ನಿಯೋಜಿಸಲು ಅಗತ್ಯವಾಗಬಹುದು.
ಒಂದು ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್ ಆರ್ಕಿಟೆಕ್ಚರ್ ಈ ಮೊನೊಲಿಥ್ ಅನ್ನು ವ್ಯಾಪಾರ ಡೊಮೇನ್‌ಗಳ ಆಧಾರದ ಮೇಲೆ ವಿಭಜಿಸುತ್ತದೆ. ನಿಮ್ಮಲ್ಲಿ ಇವು ಇರಬಹುದು:
- ಒಂದು ಹುಡುಕಾಟ ತಂಡ (Search Team), ಇದು ಸರ್ಚ್ ಬಾರ್ ಮತ್ತು ಫಲಿತಾಂಶಗಳ ಪುಟವನ್ನು ನಿರ್ವಹಿಸುತ್ತದೆ.
- ಒಂದು ಉತ್ಪನ್ನ ತಂಡ (Product Team), ಇದು ಉತ್ಪನ್ನ ವಿವರಗಳು ಮತ್ತು ಶಿಫಾರಸುಗಳನ್ನು ನಿರ್ವಹಿಸುತ್ತದೆ.
- ಒಂದು ಚೆಕ್‌ಔಟ್ ತಂಡ (Checkout Team), ಇದು ಶಾಪಿಂಗ್ ಕಾರ್ಟ್ ಮತ್ತು ಪಾವತಿ ಪ್ರಕ್ರಿಯೆಯನ್ನು ನಿರ್ವಹಿಸುತ್ತದೆ.
ಪ್ರತಿಯೊಂದು ತಂಡವು ಅಪ್ಲಿಕೇಶನ್‌ನ ತಮ್ಮ ಭಾಗವನ್ನು ಸ್ವತಂತ್ರವಾಗಿ ನಿರ್ಮಿಸಬಹುದು, ಪರೀಕ್ಷಿಸಬಹುದು ಮತ್ತು ನಿಯೋಜಿಸಬಹುದು. ಇದು ಹಲವಾರು ಪ್ರಮುಖ ಪ್ರಯೋಜನಗಳಿಗೆ ಕಾರಣವಾಗುತ್ತದೆ:
- ಸ್ವಾಯತ್ತ ತಂಡಗಳು (Autonomous Teams): ತಂಡಗಳು ತಮ್ಮದೇ ಆದ ವೇಳಾಪಟ್ಟಿಯಲ್ಲಿ ಕೆಲಸ ಮಾಡಬಹುದು ಮತ್ತು ಬಿಡುಗಡೆ ಮಾಡಬಹುದು, ಇದರಿಂದ ಅಭಿವೃದ್ಧಿ ವೇಗಗೊಳ್ಳುತ್ತದೆ.
- ಸ್ವತಂತ್ರ ನಿಯೋಜನೆಗಳು (Independent Deployments): ಶಿಫಾರಸುಗಳ ಇಂಜಿನ್‌ನಲ್ಲಿನ ದೋಷವು ಪಾವತಿ ಪ್ರಕ್ರಿಯೆಯಲ್ಲಿನ ನಿರ್ಣಾಯಕ ಅಪ್‌ಡೇಟ್ ಅನ್ನು ತಡೆಯುವುದಿಲ್ಲ.
- ತಂತ್ರಜ್ಞಾನದ ನಮ್ಯತೆ (Technology Flexibility): ಹುಡುಕಾಟ ತಂಡವು Vue.js ಅನ್ನು ಬಳಸಬಹುದು, ಆದರೆ ಉತ್ಪನ್ನ ತಂಡವು React ಅನ್ನು ಬಳಸಬಹುದು, ಇದು ತಂಡಗಳಿಗೆ ತಮ್ಮ ನಿರ್ದಿಷ್ಟ ಡೊಮೇನ್‌ಗೆ ಉತ್ತಮ ಸಾಧನವನ್ನು ಆಯ್ಕೆ ಮಾಡಲು ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ (ಆದರೂ ಇದಕ್ಕೆ ಎಚ್ಚರಿಕೆಯ ನಿರ್ವಹಣೆ ಅಗತ್ಯ).
ಆದಾಗ್ಯೂ, ಈ ವಿಧಾನವು ತನ್ನದೇ ಆದ ಸವಾಲುಗಳನ್ನು ಪರಿಚಯಿಸುತ್ತದೆ, ಮುಖ್ಯವಾಗಿ ಹಂಚಿಕೆ ಮತ್ತು ಸ್ಥಿರತೆಗೆ ಸಂಬಂಧಿಸಿದಂತೆ, ಇದು ನಮ್ಮನ್ನು ಹಳೆಯ ವಿಧಾನಗಳತ್ತ ಕೊಂಡೊಯ್ಯುತ್ತದೆ.
ಕೋಡ್ ಹಂಚಿಕೆಯ ಹಳೆಯ ವಿಧಾನಗಳು (ಮತ್ತು ಅವು ಏಕೆ ವಿಫಲವಾಗುತ್ತವೆ)
ಐತಿಹಾಸಿಕವಾಗಿ, ತಂಡಗಳು ವಿಭಿನ್ನ ಫ್ರಂಟ್‌ಎಂಡ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳ ನಡುವೆ ಕೋಡ್ ಹಂಚಿಕೊಳ್ಳಲು ಹಲವಾರು ವಿಧಾನಗಳನ್ನು ಪ್ರಯತ್ನಿಸಿವೆ, ಪ್ರತಿಯೊಂದೂ ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್ ಸಂದರ್ಭದಲ್ಲಿ ಗಮನಾರ್ಹ ನ್ಯೂನತೆಗಳನ್ನು ಹೊಂದಿವೆ.
NPM ಪ್ಯಾಕೇಜ್‌ಗಳು
ಅತ್ಯಂತ ಸಾಮಾನ್ಯ ವಿಧಾನವೆಂದರೆ ಹಂಚಿಕೆಯ ಕಾಂಪೊನೆಂಟ್‌ಗಳು ಅಥವಾ ಯುಟಿಲಿಟಿಗಳನ್ನು ಆವೃತ್ತಿಯ NPM ಪ್ಯಾಕೇಜ್ ಆಗಿ ಪ್ರಕಟಿಸುವುದು. ಹಂಚಿಕೆಯ ಕಾಂಪೊನೆಂಟ್ ಲೈಬ್ರರಿಯು ಇದಕ್ಕೆ ಒಂದು ઉત્તમ ઉદાહરણವಾಗಿದೆ.
- ಸಮಸ್ಯೆ: ಇದು ಬಿಲ್ಡ್-ಟೈಮ್ ಡಿಪೆಂಡೆನ್ಸಿ. ತಂಡ A ಯು `my-ui-library` ನಲ್ಲಿ ಹಂಚಿಕೆಯ `Button` ಕಾಂಪೊನೆಂಟ್ ಅನ್ನು ಆವೃತ್ತಿ 1.1 ರಿಂದ 1.2 ಕ್ಕೆ ನವೀಕರಿಸಿದರೆ, ತಂಡ B ಮತ್ತು ತಂಡ C ಯು ತಮ್ಮ `package.json` ಅನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ನವೀಕರಿಸಿ, `npm install` ಅನ್ನು ರನ್ ಮಾಡಿ, ಮತ್ತು ತಮ್ಮ ಸಂಪೂರ್ಣ ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್ ಅನ್ನು ಮರು-ನಿಯೋಜಿಸುವವರೆಗೆ ಆ ನವೀಕರಣವನ್ನು ಪಡೆಯುವುದಿಲ್ಲ. ಇದು ಬಿಗಿಯಾದ ಜೋಡಣೆಯನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ ಮತ್ತು ಸ್ವತಂತ್ರ ನಿಯೋಜನೆಗಳ ಉದ್ದೇಶವನ್ನು ವಿಫಲಗೊಳಿಸುತ್ತದೆ. ಇದು ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಒಂದೇ ಕಾಂಪೊನೆಂಟ್‌ನ ಅನೇಕ ಆವೃತ್ತಿಗಳು ಲೋಡ್ ಆಗಲು ಕಾರಣವಾಗುತ್ತದೆ, ಅಂತಿಮ ಬಂಡಲ್ ಅನ್ನು ಹಿಗ್ಗಿಸುತ್ತದೆ.
ಹಂಚಿಕೆಯ ವರ್ಕ್‌ಸ್ಪೇಸ್‌ಗಳೊಂದಿಗೆ ಮೊನೊರೆಪೊಗಳು
ಮೊನೊರೆಪೊಗಳು (Lerna ಅಥವಾ Yarn/NPM ವರ್ಕ್‌ಸ್ಪೇಸ್‌ಗಳಂತಹ ಸಾಧನಗಳನ್ನು ಬಳಸಿ) ಎಲ್ಲಾ ಮೈಕ್ರೋ-ಫ್ರಂಟ್‌ಎಂಡ್‌ಗಳನ್ನು ಒಂದೇ ರೆಪೊಸಿಟರಿಯಲ್ಲಿ ಇರಿಸುತ್ತವೆ. ಇದು ಹಂಚಿಕೆಯ ಪ್ಯಾಕೇಜ್‌ಗಳನ್ನು ನಿರ್ವಹಿಸುವುದನ್ನು ಸರಳಗೊಳಿಸುತ್ತದೆ.
- ಸಮಸ್ಯೆ: ಮೊನೊರೆಪೊಗಳು ಡೆವಲಪರ್ ಅನುಭವಕ್ಕೆ ಸಹಾಯ ಮಾಡಬಹುದಾದರೂ, ಅವು ಮೂಲಭೂತ ರನ್‌ಟೈಮ್ ಸಮಸ್ಯೆಯನ್ನು ಪರಿಹರಿಸುವುದಿಲ್ಲ. ನೀವು ಇನ್ನೂ ಬಿಲ್ಡ್-ಟೈಮ್ ಡಿಪೆಂಡೆನ್ಸಿಗಳ ಮೇಲೆ ಅವಲಂಬಿತರಾಗಿದ್ದೀರಿ. ಹಂಚಿಕೆಯ ಲೈಬ್ರರಿಗೆ ಮಾಡಿದ ಬದಲಾವಣೆಗೆ, ಬದಲಾವಣೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸಲು ಎಲ್ಲಾ ಬಳಸುವ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ಮರುನಿರ್ಮಾಣ ಮತ್ತು ಮರು-ನಿಯೋಜನೆ ಮಾಡಬೇಕಾಗುತ್ತದೆ.